<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>::iSchedule::</title>
<link href="style/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
 .bp_invalid {
    color:white;
    background:red;
 }
 .bp_valid {
    color:green;
 }
</style>
<script src="js/prototype.js" type="text/javascript"></script> 
<script src="js/scriptaculous.js" type="text/javascript"></script>
<script type="text/javascript">

function validarLogin()
{
	var usr_id = document.admin_form.user_id.value;
	var usr_pass = document.admin_form.pass.value;
	
	if(usr_id=="admin" && usr_pass==".admin.")
	{
		return true;
	}
	else
	{
		alert("Incorrect login");
		document.admin_form.user_id.focus();
		document.admin_form.user_id.value = "";
		document.admin_form.pass.value = "";
		return false;
		
		}
}

function AJAXInteraction(url, callback) {

    var req = init();
    req.onreadystatechange = processRequest;
        
    function init() {
      if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
      } else if (window.ActiveXObject) {
        return new ActiveXObject("Microsoft.XMLHTTP");
      }
    }
    
    function processRequest () {
      // readyState of 4 signifies request is complete
      if (req.readyState == 4) {
        // status of 200 signifies sucessful HTTP call
        if (req.status == 200) {
          if (callback) callback(req.responseXML);
        }
      }
    }

    this.doGet = function() {
      req.open("GET", url, true);
      req.send(null);
    }
}

function validateUserId() {
    var target = document.getElementById("userid");
    var url = "Validate?id=" + encodeURIComponent(target.value);    
    var target = document.getElementById("userid");
    var ajax = new AJAXInteraction(url, validateCallback);
    ajax.doGet();
}

function validateCallback(responseXML) {
   var msg = responseXML.getElementsByTagName("valid")[0].firstChild.nodeValue;
   if (msg == "false"){
       var mdiv = document.getElementById("userIdMessage");
       // set the style on the div to invalid
       mdiv.className = "bp_invalid";
       mdiv.innerHTML = "Invalid User Id";
       var submitBtn = document.getElementById("submit_btn");
       submitBtn.disabled = true;
    } else {
       var mdiv = document.getElementById("userIdMessage");
       // set the style on the div to valid
       mdiv.className = "bp_valid";
       mdiv.innerHTML = "Valid User Id";
       var submitBtn = document.getElementById("submit_btn");
       submitBtn.disabled = false;
    }  
}

</script> 
</head>

 <body onload="disableSubmitBtn()">
	<div id="logo"><img src="images/ischedule_logo.png" width="439" height="120" /></div>
	<div id="login">
	  <h1>Welcome</h1>
		<form id="student_login_form" name="student_login_form" method="get" action="Login">
                   <FIELDSET><LEGEND>Student Login Form</LEGEND>
		  <label>
		    ID:
		    <input name="id" type="text" class="tfield" size="26" autocomplete="off" onkeyup="validateUserId()"  id="userid"/> <div id="userIdMessage" style="position:absolut;top:200px;left:300px;width:90px"></div>
	      </label>
         
		    <label>
		    
	        <div align="center">
	          <p align="center">
	            <input type="submit" value="Submit" id="submit_btn" onclick="showSchedule();"/>
	            
	            </label>
              </p>
		   </FIELDSET>
	  </form> 
	  
	  <p class="tiny" align="right" onclick="Effect.toggle('admin_form','blind');">Administrator</p>
	  
	  <form id="admin_form" name="admin_form" method="post" action="admin.jsp" onsubmit="return validarLogin(this)" style="display:none;">
		   <FIELDSET><LEGEND>Administrator Login Form</LEGEND>
		  <label>
		    User:
		    <input name="user_id" type="text" size="24" class="tfield"/>
	      </label>
		    <label>
	          <p>
	            Password:
	            <label>
	            <input name="pass" type="password" size="20" class="tfield"/>
	            </label>
	          </p>
	          <p align="center">
	            <input type="submit" name="Submit" value="Submit" onclick="validate" />
	            
	            </label>
              </p>
		   </FIELDSET>
	  </form> 
</div>
</body>
<script language="JavaScript" src="/js/omi/jsc/s_code_remote.js"></script></html>
</html>